<template>
<div class="wd-error-content">
    <div class="wd-error-main">
        <img :src="errorData.imgData" class="error_img">
        <div class="label_div">{{errorText}}</div>
        <slot></slot>
        <!-- <div class="label_div refresh_div" v-if="errorData && errorData.isRefresh==true">刷新页面</div> -->
    </div>
</div>
</template>

<script lang="ts">
import { defineComponent, onMounted, PropType, ref } from 'vue'
import { ErrorInterFace } from './IErrorInterFace'
export default defineComponent({
  name: 'IError',
  props: {
    errorData: {
      type: Object as PropType<ErrorInterFace>,
      required: true
    }
  },
  setup (props) {
    const errorText = ref<string>('')
    const errorDict = new Map([
      ['400', { text: '无法访问此页面' }],
      ['401', { text: '你还未开通此权限，联系管理员处理就好啦~' }],
      ['402', { text: '你还未开通此权限，联系管理员处理就好啦~' }],
      ['404', { text: '抱歉，您访问的页面不存在~' }],
      ['500', { text: '网络走失未归，点击重新加载试试找回它吧~' }],
      ['default', { text: '这里空空如也，不知是好是坏~' }],
      ['empty', { text: '暂无数据' }],
      ['option_target', { text: '请选择左侧相应操作' }]
    ])
    onMounted(() => {
      init()
    })
    const init = async () => {
      let result = errorDict.get('empty') as any
      if (props.errorData) {
        if (errorDict.has(props.errorData.code)) {
          result = errorDict.get(props.errorData.code)
        } else {
          result = errorDict.get('default')
        }
        result.text = props.errorData.text ? props.errorData.text : result.text
      }
      errorText.value = result.text
    }
    return {
      errorText,
      init
    }
  }
})

</script>
